<template>
	<view style="height: 100vh; overflow: auto;">
		<view
			style="background-image: linear-gradient(#6753fe 70%,#7bd1fe); height: 190px; border-bottom-left-radius: 15%;border-bottom-right-radius: 15%;">
			<!-- <view style="padding-top: 100px;"></view> -->

		</view>
		<view style="position: absolute; top: 100px; width: 100%;  z-index: 2;">
			<view @click="updateConnect"
				style=" display: flex;flex-direction: column;align-items: center;justify-content: center;">
				<view
					style=" position: absolute; z-index:3;box-shadow: 0 1px 6px #7c7c7c;display: flex;flex-direction: column;align-items: center;justify-content: center;background-image: linear-gradient(#6753fe 70%,#7bd1fe);border: 2px solid #ffffff;width: 80px;height: 80px;   border-radius: 50%;">
					<image src="../../static/images/logo3.png" style=" width: 70px;height: 70px;   ">
					</image>
				</view>
			</view>
			<view
				style="padding-top: 40px; height: 400px;border-radius: 10px; margin: 15px; box-shadow: 0 1px 6px #c3c3c3; border:2px solid #fff;background-color: #fff;">
				<uni-forms ref="loginInfo" :modelValue="loginInfo" style="padding: 20px;" label-position="left">
					<uni-forms-item label="账套" labelWidth="40px" name="account">
						<uni-data-select class="uni-forms-item-border" :clear="false" v-model="loginInfo.account" :localdata="accountRange"
							@change="accountChange" />
					</uni-forms-item>
					<uni-forms-item label="账号" labelWidth="40px" name="userCode">
						<uni-easyinput class="uni-forms-item-border" @input="userCodeChange" v-model="loginInfo.userCode" placeholder="请输入账号">
						</uni-easyinput>
					</uni-forms-item>
					<uni-forms-item label="密码" labelWidth="40px" name="password">
						<uni-easyinput class="uni-forms-item-border" @input="passwordChange" type="password" v-model="loginInfo.password"
							placeholder="请输入密码"></uni-easyinput>
					</uni-forms-item>
					<uni-forms-item>
						<checkbox-group @change="rememberPsw">
							<label>
								<checkbox id="re" value="rememberPsw" :checked="checkRemember" color="#0055ff"
									style="transform:scale(0.7)" />记住密码
							</label>
						</checkbox-group>
						<!-- <uni-data-checkbox multiple selectedColor="blue" selectedTextColor="#666666" v-model="checkRemember"
						:localdata="remember" @change="rememberPsw">
					</uni-data-checkbox> -->
					</uni-forms-item>
					<uni-forms-item>
						<button :style="{borderRadius: '40px', backgroundColor:loginBtnColor,color: '#fff'}"
							@click="login()">登录</button>
						<!-- <button type="primary" @click="play()">播放</button> -->
					</uni-forms-item>
				</uni-forms>
			</view>
		</view>
		<!-- 底部显示的系统信息 -->
		<view style="position: fixed; width: 100%; bottom: 20px;">
			<view style="display: flex; flex-direction: row; justify-content: space-around;  ">
				<text style=" font-size: 10px; ">版本号：{{versionName}}</text>
				<text style=" font-size: 10px; ">技术支持：河北增昀网络科技有限公司</text>
			</view>
		</view>



		<!-- 提示窗示例 -->
		<!-- <uni-popup ref="alertDialog" type="dialog">
			<uni-popup-dialog :type="dialogInfo.msgType" :cancelText="dialogInfo.cancelText"
				:confirmText="dialogInfo.confirmText" :title="dialogInfo.title" :content="dialogInfo.content"
				@confirm="dialogConfirm" @close="dialogClose"></uni-popup-dialog>
		</uni-popup> -->
		<!-- 本页面弹窗 -->
		<uni-popup ref="alertDialog" type="dialog">
			<commonDiaog></commonDiaog>
		</uni-popup>
	
	</view>
</template>

<script>
	// import commDialog from '../unit/commonDiaog.vue'
	import * as SystemJs from '../../common/system.js'
	import * as configJs from '../../common/config.js'
	import silenceUpdate from '@/uni_modules/rt-uni-update/js_sdk/silence-update.js' //引入静默更新
	export default {
		components: {
			// commDialog
		},
		data() {
			return {
				//返回键点击次数
				backButtonPress: 0,
				versionName: '',
				deviceId: '',
				mainColor: '',
				//#ba251e
				loginBtnColor: "#7fb9fe",
				classes: '1-2',
				range: [{
						value: 0,
						text: "篮球"
					}
				],
				dataTree: [{
						text: "一年级",
						value: "1-0",
						children: [{
								text: "1.1班",
								value: "1-1"
							},
							{
								text: "1.2班",
								value: "1-2"
							}
						]
					},
					{
						text: "二年级",
						value: "2-0",

					}
				],

				loginInfo: {
					account: '',
					userCode: '',
					password: ''
				},
				accountRange: [],
				checkRemember: true,
			}
		},
		onShow() {
			this.mainColor = configJs.baseColor.mainTitleColor;

			var rememberPsw = uni.getStorageSync('rememberPsw')
			//全局公共信息最好存到本地缓存中，如果存放到globalData中在H5端会出现刷新页面后数据丢失的情况
			if (rememberPsw != undefined && !SystemJs.systemJs.IsEmpty(rememberPsw + "")) {
				if (rememberPsw) {
					this.checkRemember = rememberPsw;
					this.loginInfo.account = uni.getStorageSync('account')
					this.loginInfo.userCode = uni.getStorageSync('userCode')
					this.loginInfo.password = uni.getStorageSync('password')
				} else {
					this.checkRemember = rememberPsw;
					uni.removeStorageSync('account')
					uni.removeStorageSync('userCode')
					uni.removeStorageSync('password')
					this.loginInfo.userCode = ''
					this.loginInfo.password = ''
				}
			}
			this.checkLoginInfo();

			uni.getSystemInfo({
				success: (res) => {
					this.versionName = res.appVersion
				}
			})

			// #ifdef APP-PLUS
			plus.runtime.getProperty(plus.runtime.appid, (inf) => {
				this.versionName = inf.version
			})
			// #endif
			var systemConfig = uni.getStorageSync('systemConfig')
			console.log(systemConfig)
			if (!SystemJs.systemJs.IsEmpty(systemConfig)) {
				this.getAcount();
			}
			
		},
		mounted() {
			var systemConfig = uni.getStorageSync('systemConfig')
			if (SystemJs.systemJs.IsEmpty(systemConfig)) {
				var obj = SystemJs.showDialog.dialogInfo
				obj.msgType = "warn";
				obj.title = "提示";
				obj.content = "请先点击登陆界面上方位置的图标按钮，进行服务器地址和端口号的配置！";
				obj.cancel = false;
				obj.confirm = true;
				obj.dialogConfirm(() => {

				})
				obj.dialogClose(() => {

				})
				SystemJs.showDialog.openDialog(this.$refs.alertDialog, obj)
			}
		},
		//返回键点击事件
		onBackPress(options) {
			this.backButtonPress++;
			if (this.backButtonPress > 1) {
				var obj = SystemJs.showDialog.dialogInfo
				obj.msgType = "warn";
				obj.title = "提示";
				obj.content = "确定要退出吗？";
				obj.cancel = true;
				obj.confirm = true;
				obj.dialogConfirm(() => {
					plus.runtime.quit();
				})
				obj.dialogClose(() => {

				})
				SystemJs.showDialog.openDialog(this.$refs.alertDialog, obj)

			} else {
				// plus.nativeUI.toast('再按一次退出应用');
			}
			//在1秒钟之内不清空返回键点击次数。
			var timeoutID = setTimeout(() => {
				this.backButtonPress = 0;
				clearTimeout(timeoutID)
			}, 1000)
			return true;
		},
		onLoad() {
			var s = SystemJs.cryptoJS.encrypt('123')
			console.log('s', s);
			var g = SystemJs.httpUnit.getBaseUrl('app/getAcount');


			// this.loginInfo = {
			// 	account: '',
			// 	userCode: '',
			// 	password: ''
			// }
			this.updateSystem();
		},
		methods: {
			//账号输入框监听事件
			userCodeChange(e) {
				this.$nextTick(() => {
					this.checkLoginInfo();
				})
			},
			/**
			 * ///将异步请求同步化获取基础信息
			 */
			async getAcount() {
				this.accountRange = await configJs.getBaseInfo.getAcountInfo()
				//默认选择第一个账套
				this.loginInfo.account = this.selectFirstRage(this.accountRange, 0)
			},
			//密码输入框监听事件
			passwordChange(e) {
				this.$nextTick(() => {
					this.checkLoginInfo();
				})
			},
			//检测所有登陆数据是否全部填写
			checkLoginInfo() {
				if (SystemJs.systemJs.IsEmpty(this.loginInfo.account) || SystemJs.systemJs.IsEmpty(this.loginInfo
						.userCode) || SystemJs.systemJs.IsEmpty(this
						.loginInfo.password)) {
					this.loginBtnColor = "#7fb9fe";
				} else {
					this.loginBtnColor = "#506dff";
				}
			},
			///账套下拉框改变事件
			accountChange(e) {
				console.log(e)
				this.$nextTick(() => {
					this.checkLoginInfo();
				})
			},
			dialogConfirm() {

			},
			dialogClose() {

			},

			///登陆事件
			login() {
				if (SystemJs.systemJs.IsEmpty(this.loginInfo.account)) {
					uni.showToast({
						title: "请选择账套号",
						icon: 'error'
					})
				}
				if (SystemJs.systemJs.IsEmpty(this.loginInfo.userCode)) {
					uni.showToast({
						title: "请输入账号",
						icon: 'error'
					})
				}
				if (SystemJs.systemJs.IsEmpty(this.loginInfo.password)) {
					uni.showToast({
						title: "请输入密码",
						icon: 'error'
					})
				}
				//
				var data = {};

				SystemJs.httpUnit.requestCryptoPost({
					url: '/App/login',
					data: {
						baseCode: this.loginInfo.account,
						userCode: this.loginInfo.userCode,
						userPwd: this.loginInfo.password
					}
				}).then((res) => {
					if (res.Result) {
						// console.log(this.checkRemember)
						var data = res.Data;
						uni.setStorageSync('userInfo', data);
						this.setStoragePsw();
						this.updateSystem();
						uni.redirectTo({
							url: '/pages/main/mainPage',
							success: (res) => {

							},
							fail: (res) => {

							}
						})
					} else {
						SystemJs.httpUnit.uniToast(JSON.stringify(res.Message))
					}
				}).catch((err) => {
					SystemJs.httpUnit.uniToast(JSON.stringify(err))
				})


				//tabBar页面路径的跳转只能使用switchTab，其他方法无法进行跳转	
				// uni.switchTab({
				// 	url: '/pages/main/mainPage',
				// 	animationType: 'slide-in-bottom',
				// 	animationDuration: 300,
				// 	success: (res) => {
				// 		console.log('ckrr', this.checkRemember)
				// 		this.setStoragePsw();
				// 	},
				// 	fail: (res) => {

				// 	}
				// })
			},
			updateSystem() {
				// #ifdef APP-PLUS
				// 获取本地应用资源版本号
				plus.runtime.getProperty(plus.runtime.appid, (inf) => {
					console.log(inf)
					SystemJs.baseInfo.getDeviceInfo()
					var uuid = uni.getStorageSync('uuid')
					let data = {
						appCode: uuid,
						mVendor: plus.device.vendor, //生产厂商-huawei
						mModel: plus.device.model, //设备型号
						edition_type: plus.runtime.appid,
						version_type: uni.getSystemInfoSync().platform, //android或者ios
						versionCode: inf.versionCode, // 打包时manifest设置的版本号
						appVersion: inf.version, // 打包时manifest设置的版本名称
					}
					console.log(data)
					//获取服务器的版本号
					uni.request({
						url: SystemJs.httpUnit.getBaseUrl('/App/UpdateEditionApp'), //示例接口
						method: 'POST',
						data: data,
						success: (res) => {
							if (res.data.Result) {
								//res.data.xxx根据后台返回的数据决定（我这里后端返回的是data），所以是res.data.data 
								//判断后台返回版本号是否大于当前应用版本号 && 是否发行 （上架应用市场时一定不能弹出更新提示）
								var data = res.data.Data
								if (data != undefined && Number(data.edition_number) > Number(inf
										.versionCode) && data.edition_issue == 1) {

									//如果是wgt升级，并且是静默更新 （注意！！！ 如果是手动检查新版本，就不用判断静默更新，请直接跳转更新页，不然点击检查新版本后会没反应）
									if (data.package_type == 1 && data.edition_silence ==
										1) {

										//调用静默更新方法 传入下载地址
										silenceUpdate(data.edition_url)
									} else {
										//跳转更新页面 （注意！！！如果pages.json第一页的代码里有一打开就跳转其他页面的操作，下面这行代码最好写在setTimeout里面设置延时3到5秒再执行）
										uni.navigateTo({
											url: '/uni_modules/rt-uni-update/components/rt-uni-update/rt-uni-update?obj=' +
												JSON.stringify(data)
										});
									}
								} else {
									// 如果是手动检查新版本 需开启以下注释
									/* uni.showModal({
									    title: '提示',
									    content: '已是最新版本',
									    showCancel: false
									}) */
								}
							} else {
								console.log(res.data.Message)
								SystemJs.httpUnit.uniToast(res.data.Message)
							}
						},
						fail: (res) => {
							console.log(res)
							SystemJs.httpUnit.uniToast(res)
						}
					})
				});
				// #endif
			},
			play() {
				SystemJs.ScanAudio.playRight();
				//长震动
				uni.vibrateLong({
					success: () => {
						console.log('succ', 'success')
					}
				})
			},
			rememberPsw(e) {
				var valus = e.detail.value
				if (valus.length > 0 && valus.includes('rememberPsw')) {
					console.log('e', valus)
					this.checkRemember = true
					this.setStoragePsw();
					console.log('e', this.checkRemember);
				} else {
					this.checkRemember = false
				}
			},
			///将信息添加到缓存中
			setStoragePsw() {
				console.log(this.checkRemember)
				uni.setStorageSync('rememberPsw', this.checkRemember);
				uni.setStorageSync('account', this.loginInfo.account);
				uni.setStorageSync('userCode', this.loginInfo.userCode);
				uni.setStorageSync('password', this.loginInfo.password);
			},
			selectFirstRage(rage, index) {
				var item = "";
				//默认选择第一个账套
				if (rage != undefined && rage.length > 0 && index < (rage.length)) {
					item = rage[index].value;
				}
				return item;
			},
			//修改系统连接地址
			updateConnect() {
				uni.navigateTo({
					url: '/pages/main/UpdateConnectionSystem'
				})
			}
		}
	}
</script>

<style>

	/* 穿透修改输入框样式 */
	/deep/.is-input-border {
		border: none;
		/* border-bottom: 1px solid #f0f0f0; */
	}
	/* 穿透修改下拉框边框样式 */
	/deep/.uni-select{
		border: none;
	}
	.uni-forms-item-border {
		border: none;
		border-bottom: 1px solid #e6e6e6;
		border-radius: 4px;
	}
</style>